<template>
    <page-layout>
        <template v-slot:header>
            <el-input  placeholder="请输入内容" size='small' v-model="query.name"></el-input>
            <el-button type="primary" size='small' @click="queryEvt">查询</el-button>
              <el-button size='small' @click="addEvt">新增</el-button>
        </template>

        <el-table
          :data="tableData"
          style="width: 100%"
          size='small'>
          <el-table-column
            prop="name"
            label="礼品名称"
            width="180"
            fixed='left'>
          </el-table-column>
          <el-table-column
            prop="brand"
            label="品牌"
            width="180">
          </el-table-column>
          <el-table-column
            prop="price"
            label="执行价">
          </el-table-column>
          
          <el-table-column
            prop="type"
            label="类型">
          </el-table-column>
          
          <el-table-column
            prop="unit"
            label="单位">
          </el-table-column>
          
          <el-table-column
            prop="place"
            label="产地">
          </el-table-column>
          
          <el-table-column
            label="操作" fixed="right">
            <template slot-scope="{row}">
              <el-button type="text" size="small" @click="editEvt(row)">编辑</el-button>
              <el-button type="text" size="small" @click='detailsEvt(row)'>详情</el-button>
              <el-button type="text" size="small" @click="deleteEvt(row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
    </page-layout>
</template>
<script>
import {giftListApi,giftUpdateApi,giftAddApi,giftDeleteApi} from '../../../../apis/giftApi'
export default {
  data() {
    return {
      tableData:[],
      query:{
        page:1,
        size:20,
        name:''
      }
    }
  },
  inject:['reload'],
  mounted(){
    this.getGiftListApi()
  },
  methods: {
    queryEvt(){
      this.query.page=1
      this.getGiftListApi()
    },
    addEvt(){
      console.log(arguments)
    },
    async getGiftListApi(){
      let result = await giftListApi(this.query)
      if(result.code===200){
        this.tableData = result.data.rows
      }
    },
    editEvt(data){
        this.$router.push({
            path:'/product/gift/edit',
            query:data
        })
    },
    detailsEvt(){
      this.$router.push({
        path:'/product/gift/detali',
        query:data
      })
    },
    deleteEvt({id,name}){
      this.$confirm(
            `确定要删除【${name}】产品信息，删除后不可以恢复，确定要删除？`,
            '删除确认',
            {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'error'
            }
        ).then(async () => {
            let result = await giftDeleteApi(id)
            if (result.code !== 200) {
                this.$message.error('删除失败，原因：' + result.message)
                return
            }
            this.$message.success('删除成功')
            // setTimeout(()=>{
            //     this.$router.go(0)
            // })
            this.reload()
        }).catch(() => {
            this.$message.success('取消成功')
        }
      )
    }
  },

}
</script>
<style lang="less" scoped>
    
</style>